放大缩小选择器 transform

通常我们在前端的开发当中如果要实现标签的放大缩小等功能,可以使用CSS当中的transform: scale(1.01)来进行实现,通常搭配 focus与hover两个选择器进行使用,如:

1
2
3
4
5
6
7
8
9
10
11
12
13
.form:focus {
border-bottom: 5px solid #25c181;
color: #25c181;
-webkit-transition: 1s;
transform: scale(1.01);
}
.form:hover {
border-bottom: 5px solid #25c181;
color: #25c181;
-webkit-transition: 1s;
transform: scale(1.01);
box-shadow: 0px 2px 0px #79f8c3;
}

在以上的语句当中,其中scale(1.01)用于约定放大的效果,这里建议不超越2以上的数值,不然写出来的前端估计稍微有点那么不怎么好看。

本文使用《江雪分析公开知识存储库知识共享许可证》进行发布